<template>
  <div>
    <div class="maincss">
      <el-row>
        <el-card>
          <!--          <searchBox title='盘点记录' :btn='btn' @func='showBtn' @sendParent="queryListByParams"/>-->
          <el-card class="filter-container" shadow="never">
            <el-row class="type">
              <el-col span="3">
                <el-input
                  v-model="queryParams.inventoryNo"
                  placeholder="耗材名称、编号"
                  clearable
                />
              </el-col>
              <el-col span="3">
                <el-date-picker
                  v-model="queryParams.checkTime"
                  type="datetime"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  placeholder="选择使用时间"
                >
                </el-date-picker>
              </el-col>

              <el-col span="3">
                <el-button @click="handleLoadAndQuery()" class="btn"
                  >查询</el-button
                >
              </el-col>
            </el-row>
          </el-card>
          <el-card class="gray-card no-border no-margin-top" shadow="never">
            <el-table
              v-loading="loading"
              :data="checkList"
              style="width: 100%;"
            >
              <el-table-column
                label="库存盘点单号"
                align="center"
                prop="inventoryNo"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="库存盘点时间"
                align="center"
                prop="checkTime"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="盘点人"
                align="center"
                prop="checker"
                :show-overflow-tooltip="true"
              />
              <el-table-column label="盘点结果" align="center" prop="result" />
              <el-table-column
                label="操作"
                align="center"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    @click="handleOpenDetail(scope.row)"
                    >详情
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
          <!--          <pagination v-show="total>0" :total="total" :page.sync="pageNum" :limit.sync="pageSize"/>-->
          <div class="pagination-container">
            <pagination
              v-show="total > 0"
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="handleLoadAndQuery"
            />
          </div>
        </el-card>
      </el-row>
    </div>
  </div>
</template>

<script>
// import { materialStoreList } from '../../../api/business/materialStore'
import { listMaterialInventorylogs } from "../../../api/business/materialInventorylogs";

export default {
  name: "check-record",
  components: {},
  data() {
    return {
      btn: {
        checkRecord: true,
        add: false,
        reg: false,
        down: false,
        export: false,
        imp: false
      },
      checkList: [],
      loading: false,
      redirect: undefined,
      activeName: "1",
      deviceInfo: {},
      type: [],
      value: "",
      total: 5,
      checkId: "",
      isVisible: false,
      createTime: "",
      inventoryNo: "",
      queryParams: {
        pageNum: 1,
        pageSize: 20
      }
    };
  },
  watch: {},
  created() {
    this.handleLoadAndQuery();
  },
  methods: {
    handleLoadAndQuery() {
      this.loading = true;
      listMaterialInventorylogs(this.queryParams).then(response => {
        this.loading = false;
        this.checkList = response.rows;
        this.total = response.total;
      });
    },
    handleOpenDetail(row) {
      this.$router.push({
        path: "/consumable/checkRecord/components/detail",
        query: { id: row.id }
      });
    }
  }
};
</script>
